window.addEventListener('load', function () {

	// 隐藏搜索栏部分开始
	var topWhole = document.querySelector('.topWhole');
	window.onscroll = function () {
		console.log(window.pageYOffset);
		if (window.pageYOffset >= 300) {
			topWhole.style.top = '0px';
		} else {
			topWhole.style.top = '-52px';
		}
	}

	var topWholeIcon = document.querySelector('.topWhole_icon');
	var topWholeSearch = document.querySelector('.topWhole_ss');
	var srhLab = document.querySelector('.srh_lab');
	topWholeIcon.addEventListener('click', function () {
		topWholeIcon.style.display = "none";
		srhLab.style.display = "none";
	});
	topWholeSearch.addEventListener('click', function () {
		topWholeIcon.style.display = "block";
		srhLab.style.display = "block";
	})
	// 隐藏搜索栏部分结束

	// 顶部广告部分开始
	var close = document.querySelector(".close");
	var topAd = document.querySelector(".top_ad");
	if (close && topAd) {
	    close.onclick = function () {
	        topAd.style.display = "none";
	    }
	}
	// 顶部广告部分结束


	
	

	// 轮播图部分开始
	// 1.获取元素
	var banner = document.querySelector('.banner');
	var bannerImg = document.querySelector('.bannerImg');
	var arrow_l = document.querySelector('.arrow_l');
	var arrow_r = document.querySelector('.arrow_r');
	var bannerImgWidth = bannerImg.offsetWidth;
	// 2.鼠标经过banner,左右按钮显示隐藏。
	banner.addEventListener('mouseenter', function () {
		clearInterval(timer); //鼠标经过图片，停止自动播放
	});
	banner.addEventListener('mouseleave', function () {
		timer = setInterval(function () {
			arrow_r.click();
		}, 2000) //鼠标离开图片，继续自动播放
	});

	// 3.动态生成小圆圈  有几张图片,我就生成几个小圆圈
	var ul = banner.querySelector('ul');
	var ol = banner.querySelector('ol');
	for (var i = 0; i < ul.children.length - 1; i++) {
		var li = document.createElement('li');
		li.setAttribute('index', i);
		ol.appendChild(li);

		// 4.小圆圈排他思想实现点击哪个,哪个变白
		li.addEventListener('click', function () {
			for (var i = 0; i < ol.children.length; i++) {
				ol.children[i].className = '';
			}
			this.className = 'current';
			// 5.点击小圆圈,图片移动,移动的是ul
			var index = this.getAttribute('index');

			// 防止乱跳
			num = index;
			circle = index;

			animate(ul, -index * bannerImgWidth);
		})
	}
	// 6.点击右箭头,图片移动
	// 克隆节点
	var first = ul.children[0].cloneNode(true);
	ul.appendChild(first);

	var num = 0;
	var circle = 0;

	var flag = true;

	arrow_r.addEventListener('click', function () {
		if (flag) {
			flag = false;
			if (num == ol.children.length) {
				ul.style.left = 0;
				num = 0;
			}
			num++;
			animate(ul, -num * bannerImgWidth, function () {
				flag = true;
			});
			circle++;
			if (circle == ol.children.length) {
				circle = 0;
			}
			circleChange();
		}
	})

	// 7.点击左箭头,图片移动
	arrow_l.addEventListener('click', function () {
		if (num == 0) {
			num = ol.children.length - 1;
			ul.style.left = -num * bannerImgWidth;
		}
		num--;
		animate(ul, -num * bannerImgWidth);
		// 点击左侧按钮,小圆圈跟随一起变化,可以再声明一个变量控制小圆圈的播放
		circle--;
		// 当circle < 0,说明第一张图片,则小圆圈要改为第4个小圆圈
		if (circle < 0) {
			circle = ol.children.length - 1;
		}
		circleChange();
	})
	//自动轮播
	var timer = setInterval(function () {
		arrow_r.click();
	}, 2000)

	function circleChange() {
		for (var i = 0; i < ol.children.length; i++) {
			ol.children[i].className = '';
		}
		ol.children[circle].className = 'current';
	}
	// 轮播图部分结束

	// 回到顶部部分开始
	var aBtn = document.querySelector('.aBtn');
	aBtn.onclick = function () {
		var time = setInterval(function () {
			var target = 0;
			//获取页面当前滚动的距离
			var leader = scroll().top;
			var step = (target - leader) / 10;
			step = step > 0 ? Math.ceil(step) : Math.floor(step);
			leader = leader + step;
			//滚动到leader位置
			window.scrollTo(0, leader);
			console.log(leader);
			if (target == leader) {
				//清除计时器
				clearInterval(time);
			}
		}, 15);
	}

	function scroll() {
		return {
			top: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0,
			left: window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0
		};
	}
	// 回到顶部部分结束
	var footerGd = document.querySelector('.footer_gd');
	var footerList = document.querySelector('.footer_list');
	footerGd.addEventListener('click', function () {
		if (footerList.style.display = "none") {
			footerList.style.display = "block";
			footerGd.style.display = "none";
		}
	})

	// 获取浮动广告和关闭按钮
	var floatingAd = document.getElementById('floatingAd');
	var closeAd = document.getElementById('closeAd');

	// 关闭广告的逻辑
	closeAd.addEventListener('click', function () {
		floatingAd.style.display = 'none'; // 隐藏广告
	});

    // 获取搜索框、搜索按钮和猜你喜欢区域，改为获取头部搜索部分的元素
    const searchInput = document.querySelector('.header_search .srh_news');
    const searchButton = document.querySelector('.header_search .srh_btn');
    const likeItems = document.querySelectorAll('.like_body a');

    // 搜索框输入事件监听
    if (searchInput && likeItems.length > 0) {
        searchInput.addEventListener('input', function () {
            const keyword = this.value.toLowerCase();
            console.log('输入的关键词:', keyword);
            likeItems.forEach(item => {
                const productName = item.textContent.toLowerCase();
                console.log('商品名称:', productName);
                if (productName.includes(keyword)) {
                    console.log('匹配成功，显示商品');
                    item.style.display = 'block';
                } else {
                    console.log('未匹配，隐藏商品');
                    item.style.display = 'none';
                }
            });
        });
    }

    // 搜索按钮点击事件监听
    const searchBtn = document.querySelector('.header_search .srh_btn');
    if (searchBtn) {
        searchBtn.addEventListener('click', function(event) {
            event.preventDefault();
            const searchInput = document.querySelector('.header_search .srh_news');
            if (!searchInput) {
                console.log('未找到搜索框元素');
                return;
            }
            const keyword = searchInput.value.trim();
            if (!keyword) {
                alert('搜索关键词为空');
                console.log('点击搜索按钮，关键词: 搜索关键词为空');
                return;
            }
            console.log('点击搜索按钮，关键词: ', keyword);
    
            // 过滤商品
            const items = document.querySelectorAll('.guess_you_like .item');
            let hasMatch = false;
            items.forEach(item => {
                const title = item.querySelector('h3').textContent;
                if (title.includes(keyword)) {
                    item.style.display = '';
                    hasMatch = true;
                } else {
                    item.style.display = 'none';
                }
            });

            console.log('是否有匹配的商品: ', hasMatch);
            if (hasMatch) {
                // 隐藏指定类名的元素
                const elementsToHide = ['.header_nav', '.banner', '.main_top', '.selected', '.ppg', '.hzgx', '.wbzx'];
                elementsToHide.forEach(selector => {
                    const elements = document.querySelectorAll(selector);
                    console.log(`选中 ${selector} 的元素数量: `, elements.length);
                    elements.forEach(element => {
                        element.style.display = 'none';
                    });
                });
    
                // 修改猜你喜欢标题为搜索结果
                const guessTitle = document.querySelector('.guess_you_like h2');
                if (guessTitle) {
                    guessTitle.textContent = '搜索结果';
                }
            }
        });
    }
});
